define('component/main/sideMenu', ['WxCore', 'component/main/mixin', 'component/main/sideMenuItem', 'component/main/CollapsedMenu', 'text!./sideMenu.html'], function (wxCore, mixin, SideMenuItem, CollapsedMenu, template) {
  // console.log(template)

  return {
    template: template,
    name: 'SideMenu',
    mixins: [mixin],
    components: {
      SideMenuItem,
    CollapsedMenu},
    props: {
      menuList: {
        type: Array,
        default() {
          return []
        }
      },
      collapsed: {
        type: Boolean
      },
      theme: {
        type: String,
        default: 'dark'
      },
      rootIconSize: {
        type: Number,
        default: 20
      },
      iconSize: {
        type: Number,
        default: 16
      },
      accordion: Boolean,
      activeName: {
        type: String,
        default: ''
      },
      openNames: {
        type: Array,
        default: () => []
      }
    },
    data() {
      return {
        openedNames: []
      }
    },
    methods: {
      handleSelect(name) {
        this.$emit('on-select', name)
      },
      getOpenedNamesByActiveName(name) {
        // console.log(this.$route)
        return this.$route.matched.map(item => item.name).filter(item => item !== name)
      }
    },
    computed: {
      textColor() {
        return this.theme === 'dark' ? '#fff' : '#495060'
      }
    },
    watch: {
      activeName(name) {
        // console.log(name)
        if (this.accordion) this.openedNames = this.getOpenedNamesByActiveName(name)
        else this.openedNames = wxCore.arrayUnion(this.openedNames, this.getOpenedNamesByActiveName(name))
      },
      openNames(newNames) {
        this.openedNames = newNames
      },
      openedNames() {
        this.$nextTick(() => {
          this.$refs.menu.updateOpened()
        })
      }
    },
    mounted() {
      this.openedNames = wxCore.arrayUnion(this.openedNames, this.getOpenedNamesByActiveName(name))
    }
  }
})
